// 引入 react 依赖
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Text, View, Image, TouchableOpacity, ImageBackground, ScrollView, InteractionManager } from 'react-native';

// 引入第三方依赖
import _ from 'lodash';
import pureRender from 'pure-render-decorator';
import { Actions } from 'react-native-router-flux';
import Icon from 'react-native-vector-icons/Ionicons';

// antd 按需加载
import { Tabs, Toast, Portal } from '@ant-design/react-native';

// 引入 处理数据 所需文件
import { orderAgentSubmit } from '../../module/module.js'

// 引入公用组件
import { Status, NavBar, CacheImage, RnFlatList, Layout } from '../../components/index.js'

// 引入专用组件
import { Distpicker } from './components'

// 引入工具包
import { } from '../../util/images.js';
import { press, size, ScreenWidth, borderBottom, pathHead, defaultDataList, onEndReached, onRefresh, concatDataList, defaultPage } from '../../util/utils.js'

class SubmitAgentOrder extends Component {


  constructor(props) {
    super(props)
    this.state = {
      provinceId: '',
      provinceName: '',
      cityId: '',
      cityName: '',
    }
  }

  componentDidMount() {
    InteractionManager.runAfterInteractions(() => {
      // ...耗时较长的同步的任务...
    });
  }


  handleRrderSubmit() {
    const { goodsId, totalMoney } = this.props
    const { provinceId, provinceName, cityId, cityName, } = this.state
    if (!provinceId) {
      Toast.info('请选择省', 1, null, false);
      return
    }
    if (!cityId) {
      Toast.info('请选择市', 1, null, false);
      return
    }
    orderAgentSubmit({
      areaId: cityId,
      goodsId
    }).then(res => {
      Actions.selectPay({ ...res.data, totalMoney: totalMoney })
    })
  }

  render() {
    const { provinceId, provinceName, cityId, cityName, areaId, areaName, townId, townName, } = this.state
    return (
      <Layout
        header={<Status />}
        footer={
          <View style={{
            flexDirection: 'row',
          }}>
            <TouchableOpacity
              style={{
                flex: 1,
                height: 52,
                backgroundColor: '#000000'
              }}
              onPress={() => {
                this.handleRrderSubmit()
              }}
            >
              <Text style={{ fontSize: 14, color: '#fff', lineHeight: 52, textAlign: 'center' }}>提交订单</Text>
            </TouchableOpacity>
          </View>
        }
      >
        <NavBar
          title="购买代理"
          back={true}
        />
        <ScrollView>
          <View style={{ paddingLeft: 15 }}>
            <Distpicker
              details={{
                provinceId,
                provinceName,
                cityId,
                cityName,
                areaId,
                areaName,
                townId,
                townName,
              }}
              onPress={(address) => {
                this.setState({
                  provinceId: address.provinceId,
                  provinceName: address.provinceName,
                  cityId: address.cityId,
                  cityName: address.cityName,
                  areaId: address.areaId,
                  areaName: address.areaName,
                  townId: address.townId,
                  townName: address.townName,
                })
              }}
            />
          </View>
        </ScrollView>
      </Layout>
    );
  }
}


export default connect(({ user }) => ({
  user,
}))(pureRender(SubmitAgentOrder))
